img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.shop_banner{
  height: 40vw;
  width: 100%;

  position: relative;
}
.shop_banner_bg{
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.shop_banner_bg .mc{
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.shop_banner_head{
  height: 2.5rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding:0 .5rem;
  position: relative;
}
.shop_banner_head_left{
  width: 30%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;

}
.shop_banner_head_search{
  font-size: .6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: .2rem .6rem;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 100px;
  color: #fff
}
.shop_banner_head_search:active{
  background: rgba(255, 255, 255, 0.4);
}
.shop_banner_head img{
  height: 1rem;
  width: 1rem
}
.shop_banner_head_right{
  width: 10%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
}
.shop_banner_head_right_classify{
  width: 25vw;
      max-height: 70vw;
      background: #fff;
      position: absolute;
      top: 2rem;
      right: 0;
      z-index: 999;
      box-shadow: 1px 1px 5px #969696;
      border-radius: 5px;
      overflow-y: auto;
      display: none
}
.classify_list{
  height: 2rem;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: .6rem;
  border-bottom: 1px solid #efefef
}
.classify_list:active{
  background: #efefef
}
.classify_list:last-child{
  border: 0
}
.shop_banner_user{
  height: calc(100% - 2.5rem);
  padding: 0 .5rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
.shop_banner_user_left{
  width: 70%;
  height: 3.5rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.shop_banner_user_left_box_left{
  width: 3.2rem;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.shop_banner_user_left_box_left img{
  height: 3rem;
  width: 3rem;
  border-radius: 100px
}
.shop_banner_user_left_box_right{
  width: calc(100% - 3.2rem);
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.shop_banner_user_left_box_right_top{
  font-size: .8rem;
  color: #fff
}

.shop_banner_user_left_box_right_bot_box{
  height: 1rem;
  width: 3.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;

}
.shop_banner_user_left_box_right_bot_box img{
  object-fit: fill;
}
.shop_banner_user_right{
  height: 100%;
  width: 30%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.shop_banner_user_right_box{
  height: 2.5rem
}
.shop_banner_user_right_box_top{
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.shop_banner_user_right_box_top span{
  background: #9F71FD;
  background: linear-gradient(to right, #9F71FD , #BE87FE);
  color: #fff;
  width: 20vw;
  height: 1.5rem;
  font-size: .6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100px
}
.shop_banner_user_right_box_top .ysc{
  background: #ccc;
  color: #888
}
.shop_banner_user_right_box_bot{
  display: flex;
    justify-content: center;
    align-items: center;
    font-size: .6rem;
    color: #fff;
    margin-top: .3rem;
    position: absolute;
    padding: .1rem .3rem;
    right: .5rem
}
.shop_banner_user_right_box_bot img{
  height: .7rem;
  width: .7rem
}
.shop_more{
  padding: .5rem .5rem;
  background: #fff;
  color: #888;
  font-size: .7rem;

}
.shop_more span{
  line-height: 180%
}
.shop_more .iconfont {
color: #ccc;
}
.icon-yinhao1{
  margin-right: .2rem;
      font-size: .7rem;
}
.icon-yinhao{
  margin-left: .2rem;
      font-size: .7rem;
}
.shop_more img{
  height: .9rem;
  width: .9rem;

}

.vip_goods{
  height: 115vw;
  width: 100%;
  position: relative;
  margin-top: .5rem;
  padding-bottom: .5rem
}
.vip_goods_bg{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%
}
.vip_goods_head{
  padding: 0 .5rem;
  height: 2.5rem;
  width: 100%;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.vip_goods_head_left{
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.vip_goods_head_left img{
  height: 1.5rem;
  width: auto;
}
.vip_goods_head_right{
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;;
}
.vip_goods_head_right_box_top{
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  font-size: .6rem;
  color: #fff
}
.vip_goods_head_right_box_top img{
  height: 1rem;
  width: 3.3rem;
  object-fit: fill;
}
.vip_goods_head_right_box_bot{
  width: 100%;
  height: .8rem;
  background: #fff;
  border-radius: 100px;
  color: #A207F9;
  font-size: .6rem;
  margin-top: .2rem;
  position: relative;
}
.vip_goods_head_right_box_bot_box{
  position: absolute;
  left: 0;
  top: 0;
  background:#D8B7FE;
  border-radius: 100px;
  width: 70%;
  height: 100%
}
.vip_goods_head_right_box_bot_text{
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.vip_goods_bottom{
  height: 2.5rem;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items:center;
  position: relative;
}
.vip_goods_bottom_btn{
  width: 40%;
  height: 1.7rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #A934DA;
  font-size: .7rem;
  background: #FEDE00;
  box-shadow: 0px 3px 0px #DBB787;
  border-radius: 100px;
}
.vip_goods_bottom_btn img{
  height:.9rem;
  width: .9rem
}
.vip_goods_box{
  height: calc(100% - 5rem);
  width: 100%;
  padding: .5rem;
  position: relative;
}

.goods_box{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.goods_list{
  flex: 1;
  height: 100%;
  background: #fff;
  border-radius: 5px;
  position: relative;
}
.goods_list_add{
  height: 2rem;
  width: 2rem;
  position: absolute;
  right: .5rem;
  top: .5rem
}
.goods_list_img{
  height: 58vw;
  width: 100%
}
.goods_list_img img{
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.goods_list_msg{
  height: calc(100% - 58vw);

}
.goods_list_msg_name{
  height: 55%;
  font-size: .7rem;
  padding:0 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.goods_list_msg_money{
  height: 45%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  color: red;
  font-weight: bold;
}
.vip_goods2{
  height: 105vw
}
.goods_box2{
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
  border-radius: 5px
}
.goods_box2_list{
  flex: 1;
  height: 100%
}
.goods_box2_list:nth-child(1){
  display: flex;
  justify-content: flex-start;
}
.goods_box2_list:nth-child(2){
  display: flex;
  justify-content: flex-end;
}
.goods_box2_list_box{
  background: #fff;
  width: calc(100% - 3px);
  height: 95%;
  border-radius: 5px
}
.goods_box2_list_box .goods_list_msg_name{
  padding: 0 .5rem;
  font-size: .6rem;
  align-items: flex-end;
}
.goods_box2_list_box .goods_list_img{
  height: calc(50vw - .5rem - 3px)
}
.goods_box2_list_box .goods_list_msg{
    height: calc(100% - (50vw - .5rem - 3px));
    position: relative;
}
.bottom_bor{
  width: 100%;
  height: auto;
  position: absolute;
  bottom: -5vw;
  left: 0
}
.goods_box2_list_box .goods_list_msg_money{
  height: 35%;
  position: relative;
  z-index: 9;
  align-items: flex-end;
}
.goods_list_msg .add{
  position: absolute;
  right: 0rem;
  height: 2rem;
  width: 2rem;
  top: -1.2rem
}
.vip_goods3{
  height: 100vw
}

.vip_goods3 .vip_goods_box{
  overflow-x: auto;
}
.vip_goods_list{
  width: 30vw;
  height: 100%
}
.vip_goods3 .vip_goods_box_{
  width:calc((45vw + 5px)*3);
  height: 95%;
  display: flex;
  transition: .5s
}
.vip_goods3 .goods_box_list{
  width: calc(45vw + 5px);
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-right: 5px
}
.vip_goods3 .goods_box_list_box{
  height: 100%;
  width: 45vw;
  background: #fff;
  border-radius: 5px
}
.vip_goods3 .goods_list_img{
  height: 45vw;
}
.vip_goods3 .goods_list_msg{
  position: relative;
  height: calc(100% - 45vw)
}
.vip_goods3 .goods_list_msg_name{
  padding: 0 .5rem;
  font-size: .6rem;
  align-items: flex-end;
}
/*精品*/
.jp_goods{
  margin-top: .5rem;
  background: #fff;
}
.jp_goods_head{
  height: 2.5rem;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.jp_goods_head img{
  height: 100%;
  width: 5rem
}
.jp_goods_con{
  padding: .5rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}
.jp_goods_list{
  width: 50%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: .5rem
}
.jp_goods_list:nth-child(even){
  justify-content: flex-end;
}
.jp_goods_list_box{
  border-radius: 5px;
  box-shadow: 1px 1px 5px #ccc;
  width: calc(100% - 3px);
  padding-bottom: .5rem
}
.jp_goods_list_box_img{
  height: calc(50vw - .5rem - 3px)
}
.jp_goods_list_box_img img{
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.jp_goods_list_box_name{
  font-size: .7rem;
  padding:  .5rem;
  padding-bottom: .2rem;
  height: 2.5rem
}
.jp_goods_list_box_money{
  font-size: .8rem;
  color: red;
  font-weight: bold;
  padding: 0 .5rem
}
.toHead{
  height: 6rem;
  /*padding: .5rem 0;*/
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  right: 0;
  width: 2.5rem;
  z-index: 999;
  bottom: 60px;
  border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
}
.toHead_list{
  width: 2.5rem;
  height: 50%;
  display: flex;
  justify-content: center;
  align-items: center;

}
.toHead_list:nth-child(1){
  border-bottom: 1px solid rgba(239, 239, 239, 0.24)
}
.toHead_list_box_img{
  height: 1.5rem;
  width: 2.5rem;
  display: flex;
  justify-content: center;
}
.toHead_list_box_img img{
  height: 1.5rem;
  width: 1.5rem
}
.toHead_list_box_name{
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: .5rem
}
